import { request } from '../../request/index';
import regeneratorRuntime from '../../lib/runtime/runtime';

Page({
  data: {
    tabs:[
      {
        id: 0,
        value: "体验问题",
        isActive: true
      },
      {
        id: 1,
        value: "商品、商家投诉",
        isActive: false
      }
    ],
    // 存放被选择的图片路径的数组
    chooseImgs: [],
    // 文本域的输入内容
    textVal: ''
  },
  // 外网的图片的路径的数组
  uploadImgs: [],
  handleItemChange(e) {
    // 获取被点击的标题索引
    const {index} = e.detail;
    // 修改源数组
    let {tabs} = this.data;
    tabs.forEach((v,i) => {
      i === index ? v.isActive = true : v.isActive = false
    });
    // 赋值到data中
    this.setData({
      tabs
    })
  },
  handleChooseImg() {
    wx.chooseImage({
      // 同时选中的图片数量
      count: 9,
      // 图片的格式：原图，压缩
      sizeType: ['original', 'compressed'],
      // 图片的来源：相册，照相机
      sourceType: ['album', 'camera'],
      success: (result) => {
        this.setData({
          // 对图片数组进行拼接
          chooseImgs: [...this.data.chooseImgs,...result.tempFilePaths]
        })
      }
    });
      
  },
  handleRemoveImg(e) {
    console.log(e);
    // 获取被点击的组件的索引
    const {index} = e.currentTarget.dataset;
    // 获取data中的图片数组
    let {chooseImgs} = this.data;
    // 删除元素
    chooseImgs.splice(index, 1);
    this.setData({
      chooseImgs
    })
  },
  handleTextInput(e) {
    this.setData({
      textVal: e.detail.value
    })
  },
  handleFormSubmit() {
    const {textVal, chooseImgs} = this.data;
    if(!textVal.trim()) {
      wx.showToast({
        title: '输入不合法',
        icon: 'none',
        mask: true
      });
      return;
    }
    // 显示正在等待的图片
    wx.showLoading({
      title: '正在上传中',
      mask: true
    });
    // 判断有没有需要上传的图片数组
    if(chooseImgs.length !== 0) {
      chooseImgs.forEach((v, i) => {
        // 准备上传图片到专门的服务器,小程序的api不能同时上传多张图片,我们可以通过遍历数组，挨个上传
        wx.uploadFile({
          // 图片要上传到哪里
          url: 'https://images.ac.cn/Home/Index/UploadAction/',
          // 被上传的文件的路径
          filePath: v,
          // 上传的文件名称file
          name: "file",
          // 顺带的文本信息
          formData: {},
          success: (result) => {
            console.log(result);
            let url = JSON.parse (result.data).url;
            this.uploadImgs.push(url);
            // 所有的图片都上传完毕了才触发
            if(i === chooseImgs.length - 1) {
              wx.hideLoading();
              console.log('把文本的内容和外网的图片数组提交到后台中');
              // 提交成功后重置页面
              this.setData({
                textVal: '',
                chooseImgs: []
              })
              // 返回上一个页面
              wx.navigateBack({
                delta: 1
              }); 
            }
          }
        });
      })
    }else {
      wx.hideLoading();
      console.log('只是提交了文本');
      wx.navigateBack({
        delta: 1
      });
    }
  }
})